// JavaScript Document
var evt;
((function(a){
	//插件本体
	var datetime = function(opts){
		this.type = 'DATETIME';//DATE,TIME,DATETIME
		this.format = 'YYYY-mm-dd HH:ii:ss';
		this.date = null;//这个是具体的date对象
		this.card = null;//卡片的相关信息
		this.element = null;//当前的盒子元素的信息
		this.isIn = 0;//是否在当前的里面
		this.value = '';
		this.library = {
			top:this,
			output:[],
			element:{},
		};
		//设置类型
		this.setType = function(code){
			this.type = a.kuoqiJs.strtoupper(code);
			
		}
		//格式化
		this.setFormat = function(format){
			this.format = format;	
		}
		//输出内容
		this.output = function(code){
			if(typeof(code)=='function'){
				this.library.output.push(code);	
			}else{
				for(var i = 0;i<this.library.output.length;i++){
					this.library.output[i](this.value);
				}
			}
		}
		//清空之前的输出选项
		this.outputClear = function(){
			this.library.output = [];
		}
		//下一年
		this.nextYear = function(){this.date.setFullYear(this.getYear() + 1);}
		this.prevYear = function(){this.date.setFullYear(this.getYear() - 1);}
		this.getYear = function(){ return this.date.getFullYear()};
		this.setYear = function(code){ return this.date.setFullYear(code)};
		
		//下一月
		this.nextMonth = function(){this.date.setMonth(this.getMonth());}
		this.prevMonth = function(){this.date.setMonth(this.getMonth() - 2);}
		this.getMonth = function(){ return this.date.getMonth() + 1};
		this.setMonth = function(code){ return this.date.setMonth(code)};
		//下一天
		this.nextDate = function(){this.date.setDate(this.getDate() + 1);}
		this.prevDate = function(){this.date.setDate(this.getDate() - 1);}
		this.getDate = function(){ return this.date.getDate()};
		this.setDate = function(code){ return this.date.setDate(code)};
		//下一个小时
		this.nextHours = function(){this.date.setHours(this.getHours() + 1);}
		this.prevHours = function(){this.date.setHours(this.getHours() - 1);}
		this.getHours = function(){ return this.date.getHours()};
		this.setHours = function(code){ return this.date.setHours(code)};
		//下一个分钟
		this.nextMinutes = function(){this.date.setMinutes(this.getMinutes() + 1);}
		this.prevMinutes = function(){this.date.setMinutes(this.getMinutes() - 1);}
		this.getMinutes = function(){ return this.date.getMinutes()};
		this.setMinutes = function(code){ return this.date.setMinutes(code)};
		//下一秒
		this.nextSeconds = function(){this.date.setSeconds(this.getSeconds() + 1);}
		this.prevSeconds = function(){this.date.setSeconds(this.getSeconds() - 1);}
		this.getSeconds = function(){ return this.date.getSeconds()};
		this.setSeconds = function(code){ return this.date.setSeconds(code)};
		//获取本月有多少天
		this.getMaxdate = function(){
			if([1,3,5,7,8,10,12].includes(this.getMonth())){
				return 31;	
			}else if(this.getMonth()==2){
				if(this.getYear() % 4){
					return 28;	
				}else{
					return 29;	
				}
			}else{
				return 30;	
			}
		}
		//获取第一格是星期几，周天是0
		this.getFirstday = function(){
			var date = new Date(this.getYear()+'-'+(this.getMonth())+'-1');	
			return date.getDay();
		}
		
		//周几
		this.getDay = function(){return this.date.getDay();}
		//冲刷值
		this.push = function(){
			this.resetUIDatetime();//重置需要重置的部分deUI
			var ths = this;
			//冲刷进入到头部win
			this.value = this.format;
			this.value = this.value.replace(/Y+/,function(rs){
				return ths.getYear().toString().slice(4 - rs.length,4);
			});
			this.value = this.value.replace(/m+/,function(rs){
				return a.kuoqiJs.strspad(ths.getMonth(),'0',rs.length);
			});
			this.value = this.value.replace(/d+/,function(rs){
				return a.kuoqiJs.strspad(ths.getDate(),'0',rs.length);
			});
			this.value = this.value.replace(/H+/,function(rs){
				return a.kuoqiJs.strspad(ths.getHours(),'0',rs.length);
			});
			this.value = this.value.replace(/i+/,function(rs){
				return a.kuoqiJs.strspad(ths.getMinutes(),'0',rs.length);
			});
			this.value = this.value.replace(/s+/,function(rs){
				return a.kuoqiJs.strspad(ths.getSeconds(),'0',rs.length);
			});
			this.library.element.win.text(this.value);
		}
		
		//展示内容
		this.show = function(format){
			if(format){
				this.date = new Date(format);
			}else{
				this.date = new Date();
			}
			this.push();
			this.card.show();
		}
		//展示到某个元素的下面
		this.doShowByElement = function(element){
			this.element = element;
			a.kuoqiJs(element).next(this.card);
			this.show();
		}
		//隐藏插件
		this.hide = function(){ this.card.hide();}
		//创建日期插件
		this.createDate = function (){}
		//创建时间插件
		this.createTime = function(){}
		//创建时间日期插件
		this.createDatetime = function(){
			var ths = this;
			//配置年月日的相关信息
			this.library.element.prevYear = $Q('<div style="padding:0.25em;cursor: pointer;border-right: 0;height: 2em;line-height: 2em;"><<</div>');
			this.library.element.nextYear = $Q('<div style="padding:0.25em;cursor: pointer;height: 2em;line-height: 2em;">>></div>');
			this.library.element.prevMonth = $Q('<div style="padding:0.25em;cursor: pointer;border-right: 0;height: 2em;line-height: 2em;"><</div>');
			this.library.element.nextMonth = $Q('<div style="padding:0.25em;cursor: pointer;border-right: 0;height: 2em;line-height: 2em;">></div>');
			this.library.element.win = $Q('<div style="padding:0.25em;flex: auto;text-align: center;cursor: pointer;border-right: 0;height: 2em;line-height: 2em;">'+this.format+'</div>');
			this.library.element.dateheadbox = $Q('<div style="display:flex;overflow:hidden;"></div>');
			this.library.element.dateheadbox.append(this.library.element.prevYear);
			this.library.element.dateheadbox.append(this.library.element.prevMonth);
			this.library.element.dateheadbox.append(this.library.element.win);
			this.library.element.dateheadbox.append(this.library.element.nextMonth);
			this.library.element.dateheadbox.append(this.library.element.nextYear);
			this.library.element.cardhead.append(this.library.element.dateheadbox);
			this.library.element.prevYear.on('click',function(){ ths.prevYear();ths.push();ths.output()});
			this.library.element.prevMonth.on('click',function(){ ths.prevMonth();ths.push();ths.output()});
			this.library.element.nextMonth.on('click',function(){ ths.nextMonth();ths.push();ths.output()});
			this.library.element.nextYear.on('click',function(){ ths.nextYear();ths.push();ths.output()});
			this.push();
		}
		
		//时间的插件部分
		this.layoutUITime = function(){
			var ths = this;
			var stream = $Q('<div style="display: flex;text-align: center;"></div>');
			this.library.element.prevHours = $Q('<div style="cursor: pointer;padding: 0.25em;">∧</div>');
			this.library.element.nextHours = $Q('<div style="cursor: pointer;padding: 0.25em;">∨</div>');
			this.library.element.prevMinutes = $Q('<div style="cursor: pointer;padding: 0.25em;">∧</div>');
			this.library.element.nextMinutes = $Q('<div style="cursor: pointer;padding: 0.25em;">∨</div>');
			this.library.element.prevSeconds = $Q('<div style="cursor: pointer;padding: 0.25em;">∧</div>');
			this.library.element.nextSeconds = $Q('<div style="cursor: pointer;padding: 0.25em;">∨</div>');
			this.library.element.winHours = $Q('<div style="cursor: pointer;padding: 0.25em;">'+this.getHours()+'</div>');
			this.library.element.winMinutes = $Q('<div style="cursor: pointer;padding: 0.25em;">'+this.getMinutes()+'</div>');
			this.library.element.winSeconds = $Q('<div style="cursor: pointer;padding: 0.25em;">'+this.getSeconds()+'</div>');
			this.library.element.boxHours = $Q('<div style="flex: auto;"></div>');
			this.library.element.boxMinutes = $Q('<div style="flex: auto;"></div>');
			this.library.element.boxSeconds = $Q('<div style="flex: auto;"></div>');
			this.library.element.boxHours.append(this.library.element.prevHours);
			this.library.element.boxHours.append(this.library.element.winHours);
			this.library.element.boxHours.append(this.library.element.nextHours);
			
			this.library.element.boxMinutes.append(this.library.element.prevMinutes);
			this.library.element.boxMinutes.append(this.library.element.winMinutes);
			this.library.element.boxMinutes.append(this.library.element.nextMinutes);
			
			this.library.element.boxSeconds.append(this.library.element.prevSeconds);
			this.library.element.boxSeconds.append(this.library.element.winSeconds);
			this.library.element.boxSeconds.append(this.library.element.nextSeconds);
			this.library.element.prevHours.on('click',function(){ths.prevHours();ths.push();ths.output()});
			this.library.element.nextHours.on('click',function(){ths.nextHours();ths.push();ths.output()});
			this.library.element.prevMinutes.on('click',function(){ths.prevMinutes();ths.push();ths.output()});
			this.library.element.nextMinutes.on('click',function(){ths.nextMinutes();ths.push();ths.output()});
			this.library.element.prevSeconds.on('click',function(){ths.prevSeconds();ths.push();ths.output()});
			this.library.element.nextSeconds.on('click',function(){ths.nextSeconds();ths.push();ths.output()});
			stream.append(this.library.element.boxHours);
			stream.append(this.library.element.boxMinutes);
			stream.append(this.library.element.boxSeconds);
			return stream;
		}
		
		//日期的插件部分
		this.layoutUIDate = function(){
			var ths = this;
			//总计37个格子，6+31的方式
			var stream = $Q('<div></div>');
			var code = this.getFirstday();//周日为0
			var maxcode = this.getMaxdate();
			var streamhead = $Q('<div style="display: grid;grid-template-columns: 14.2857% 14.2857% 14.2857% 14.2857% 14.2857% 14.2857% 14.2857%;text-align: center;font-size: 0.75em;"><span style="box-sizing: border-box;">周日</span><span style="box-sizing: border-box;">周一</span><span style="box-sizing: border-box;">周二</span><span style="box-sizing: border-box;">周三</span><span style="box-sizing: border-box;">周四</span><span style="box-sizing: border-box;">周五</span><span style="box-sizing: border-box;">周六</span></div>');
			var streambody = $Q('<div style="display: grid;grid-template-columns: 14.2857% 14.2857% 14.2857% 14.2857% 14.2857% 14.2857% 14.2857%;text-align: center;font-size: 0.75em;"></div>');
			for(var i = 0;i<42;i++){
				if(i - code < 0 ){
					var date = $Q('<span style="box-sizing: border-box;line-height: 2em;">&nbsp;</span>');	
				}else if(i - code >= maxcode){
					var date = $Q('<span style="box-sizing: border-box;line-height: 2em;">&nbsp;</span>');
				}else{
					var date = $Q('<span data-date="'+(i - code + 1)+'" style="cursor:pointer;box-sizing: border-box;line-height: 2em;">'+(i - code + 1)+'</span>');
					if(i - code + 1 == this.getDate()){
						date.addClass('active');
					}
					date.on('click',function(ev){
						var _date = a.kuoqiJs(this).attr('data-date');
						ths.setDate(_date);
						ths.push();
						ths.output();
					});
				}
				streambody.append(date);
			}
			stream.append(streamhead);
			stream.append(streambody);
			return stream;
		}
		//重置日期时间的页面信息
		this.resetUIDatetime = function(){
			this.library.element.cardbody.html(this.layoutUIDate());
			this.library.element.cardbody.append(this.layoutUITime());
		}
		
		//初始化方法们
		this.initFunction = function(){
			var ths = this;
			//确认按钮点击，将数据打印出来
			this.library.element.surebtn.on('click',function(){ ths.output();ths.hide()});
			this.library.element.nowbtn.on('click',function(){ 
				ths.date = new Date();
				ths.push();
				ths.output();
			});
			this.library.element.cancelbtn.on('click',function(){ ths.hide();});
			this.card.on('click',function(){});
		}
		
		//创建一个插件信息
		this.create = function(){
			var ths = this;
			this.date = new Date();
			this.library.element.card = $Q('<div style="padding: 0.5em;"></div>');
			this.library.element.cardhead = $Q('<div></div>');
			this.library.element.cardbody = $Q('<div></div>');
			this.library.element.cardfoot = $Q('<div style="text-align: center;padding: 0.5em;"></div>');
			this.library.element.card.append(this.library.element.cardhead);
			this.library.element.card.append(this.library.element.cardbody);
			this.library.element.card.append(this.library.element.cardfoot);
			this.card = a.kuoqiJs('<div style="width:360px;height:400px;position: absolute;z-index: 1;background-color: #cfcfcf;box-shadow: 0px 0px 6px 2px var(--color-index);border-radius: 0.5em;"></div>');
			this.card.html(this.library.element.card);
			switch(this.type){
				case 'DATE':this.createDate();break;
				case 'TIME':this.createTime();break;
				default :this.createDatetime();break;	
			}
			//将按钮写进入
			this.library.element.cancelbtn = $Q('<button style="margin: 0.5em;" type="button">取消</button>');
			this.library.element.nowbtn = $Q('<button style="margin: 0.5em;" type="button">当前</button>');
			this.library.element.surebtn = $Q('<button style="margin: 0.5em;" type="button">确定</button>');
			this.library.element.cardfoot.append(this.library.element.cancelbtn);
			this.library.element.cardfoot.append(this.library.element.nowbtn);
			this.library.element.cardfoot.append(this.library.element.surebtn);
			this.initFunction();
		}
		this.setType(opts.type?opts.type:'datetime');
		this.element = (opts.element?opts.element:a.kuoqiJs('body'));
		this.setFormat(opts.format?opts.format:'YYYY-mm-dd HH:ii:ss');
		this.create();
	}
	a.kuoqiJs.plugIn.register('datetime',datetime);
})(this))